<link href="http://apps.bdimg.com/libs/fontawesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<link href="<%=staticFilePath%>/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="/stylesheets/front/css/app.css"/>
<script src="<%=staticFilePath%>/javascripts/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="<%=staticFilePath%>/javascripts/angular.min.js"></script>
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="101225673" data-redirecturi="http://www.doramart.com/users/qq/loginSuccess" charset="utf-8"></script>

<script type="text/javascript">
    //设定倒数秒数
    var t = 4;
    //显示倒数秒数
    function showTime(){
        t -= 1;
        $("#timeLeft").html(t);
        if(t==0){
            window.opener && window.opener.location.reload();
        }
        //每秒执行一次,showTime()
        setTimeout("showTime()",1000);
    }
</script>
<!-- BEGIN CONTAINER -->
<div class="container min-hight margin-bottom-20 margin-top-20" style="background: #FFFFFF">
    <input type="hidden" value="<%=successKey%>" id="successKey"/>
    <input type="hidden" value="" id="openId"/>
    <div class="row" style="display: none" id="loginSuccess">
        <div class="col-md-12 page-success">
            <div class="state" style="font-size: 80px;">
                <i class="fa fa-spinner fa-spin"></i>
            </div>
            <div class="details">
                <h3>登录成功，请稍后...</h3>
                <p>
                    <a id="timeLeft" class="text-danger">4</a>&nbsp;秒后页面即将跳转<br>
                </p>
            </div>
        </div>
    </div>
    <div class="row" style="margin-top:80px;display: none;" ng-app="loginApp" ng-controller="ctrl" id="confirmMyEmail">
        <div class="col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 login-signup-page">
            <form name="confirmForm" ng-submit="processConfirmForm(confirmForm.$valid)" novalidate>
                <h2>您的常用邮箱</h2>

                <div class="input-group margin-bottom-20" ng-class="{ 'has-error' : confirmForm.email.$invalid && !confirmForm.email.$pristine }">
                    <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
                    <input type="email" class="form-control" name="password" ng-model="confirmFormData.email" placeholder="请输入您的常用邮箱" required>
                </div>

                <div class="row" style="margin-top: 10px;">
                    <div class="col-md-6 col-sm-6">
                        <button type="submit" class="btn btn-primary pull-right" ng-disabled="confirmForm.$invalid">确认</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<!-- END CONTAINER -->

<script type="text/javascript">
    $(function(){

        $('.front-topbar').hide();
        $('.navbar-collapse').hide();
        //从页面收集OpenAPI必要的参数。get_user_info不需要输入参数，因此paras中没有参数
        var paras = {};
        var userOpenid = "";

        //用JS SDK调用OpenAPI
        QC.api("get_user_info", paras)
            //指定接口访问成功的接收函数，s为成功返回Response对象
                .success(function(s){
                    //成功回调，通过s.data获取OpenAPI的返回数据
                    QC.Login.getMe(function(openId, accessToken){
                        userOpenid = openId;
                        var userInfo = {
                            userName:s.data.nickname,
                            logo:s.data.figureurl_2,
                            gender:s.data.gender,
                            province:s.data.province,
                            city:s.data.city,
                            year:s.data.year,
                            openid:userOpenid
                        };

                        $.ajax({
                            url : "/users/qq/updateUserInfo",
                            method : 'GET',
                            data : userInfo,
                            dataType : 'json',
                            success : function(result){
                                $('#openId').val(userOpenid);
                                var ustate = result.uInfo;
                                if(ustate){
                                    if(ustate == 'oldUser'){
                                        $('#loginSuccess').show();
                                        showTime();
                                    }else{
                                        $('#confirmMyEmail').show();
                                    }
                                }
                            }
                        })
                    });
                })
            //指定接口访问失败的接收函数，f为失败返回Response对象
                .error(function(f){
                    //失败回调
                    location.href='/';
//                    alert("获取用户信息失败！");
                })
            //指定接口完成请求后的接收函数，c为完成请求返回Response对象
                .complete(function(c){
                    //完成请求回调
//                    alert("获取用户信息完成！");

                });
    })


</script>
<script>


    angular.module("loginApp",[])
            .controller("ctrl",function($scope,$http){
                $scope.confirmFormData = {};

                $scope.processConfirmForm =  function(isValid){
                    if(isValid){
                        $http({
                            method  : 'POST',
                            url     : '/users/qq/updateUserEmail?openId='+$('#openId').val(),
                            data    : $.param($scope.confirmFormData),  // pass in data as strings
                            headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  // set the headers so angular passing info as form data (not request payload)
                        })
                                .success(function(data) {
                                    if(data === "success"){
                                        $('#confirmMyEmail').hide();
                                        $('#loginSuccess').show();
                                        showTime();
                                    }else{
                                        alert("未知异常，请稍后重试");
                                    }
                                });
                    }
                    else{
                        alert("校验失败，请检查");
                    }
                }

            })
</script>